<template>
  <div style="width: 350px; height: 630px; margin: 0px; background-color: #efefef; position: fixed;">
        
    <el-container >
        <el-header  height="180px">
          <div style="text-align: center; font-size: 4px; margin-top: 20px; ">
          <el-row>               
          <el-col >
          <el-input  
          size="medium"
          placeholder="请输入内容" 
          prefix-icon="el-icon-search"
          clearable
          disabled
          @click.native="$router.push('sreach')"></el-input>
          </el-col> 
           </el-row>
         </div>
           
           <el-row>
                <el-col :span="24">
                    <el-menu router  class="el-menu-demo" mode="horizontal">
                        <el-menu-item  v-for="type in types" :index="type.id+''" :key="type.id+''" :route="{path:'/'+type.link,query:{id:type.id+''}}">
                          <el-avatar :size="20">
                                <img :src="type.icon"/>
                            </el-avatar>
                        {{type.typename}}
                        </el-menu-item>
                      
                </el-menu>
                    
                </el-col>
           </el-row>
           
    </el-header>
        <el-main>  
         
          <router-view :key="$route.fullPath"/>
        
        </el-main>

</el-container>
  </div>
</template>

<script>
export default {
    data(){
      return {
        types:[],
      }
    },
    methods:{
      queryType(){
        this.$axios.get('api/app/GoodsType/getGoodsType')
        .then(res=>{
           
          console.log(res.data)
          this.types = res.data.data
        })
      }
    },
    created(){
  
        this.queryType();
      }


}
</script>

<style>
</style>